import variables from "@/styles/element-variables.scss"
import defaultSettings from "@/settings"

const { showSettings, tagsView, fixedHeader, sidebarLogo, helpShow, bbsShow, forumShow } = defaultSettings

const state = {
    theme: variables.theme,
    showSettings: showSettings,
    tagsView: tagsView,
    fixedHeader: fixedHeader,
    sidebarLogo: sidebarLogo,
    helpShow: helpShow,
    bbsShow: bbsShow,
    forumShow: forumShow,
    fontSize: Number(localStorage.getItem("fontSize")) || 16,
}

const mutations = {
    CHANGE_SETTING: (state, { key, value }) => {
        if (state.hasOwnProperty(key)) {
            state[key] = value
        }
    },
    应用字体: state => {
        console.log(`应用字体 ing👇`)
        let 想修改的元素 = document.documentElement
        想修改的元素.style.cssText = `font-size: ${state.fontSize}px !important;`
        localStorage.setItem("fontSize", state.fontSize)
    },
}

const actions = {
    changeSetting({ commit }, data) {
        commit("CHANGE_SETTING", data)
    },
    加大字体({ commit, state }, val) {
        state.fontSize += 1
        commit("应用字体")
    },
    减小字体({ commit, state }, val) {
        state.fontSize -= 1
        commit("应用字体")
    },
    应用字体({ commit, state }, val) {
        commit("应用字体")
    },
}

export default {
    namespaced: true,
    state,
    mutations,
    actions,
}
